<%-- 
    Document   : inicio_personal
    Created on : 28/10/2013, 09:54:29 AM
    Author     : Ayner Pérez
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Sistema de Adopciones</title>
        <link rel="stylesheet" href="<%=request.getContextPath()%>/assets/css/bootstrap.css">
        <link rel="stylesheet" href="<%=request.getContextPath()%>/assets/css/index_002.css">
        <link rel="stylesheet" href="<%=request.getContextPath()%>/assets/css/mimp_css.css">
        <!-- Datepicker -->
        <link href="${pageContext.servletContext.contextPath}/assets/css/datepicker3.css" rel="stylesheet">
    </head>

    <body id="bd" class="bd fs3 com_content">
        <br>
        <br>
        <div id="wrap">
            <div class="row">
                <div class="col-md-1"></div>
                <div class="col-md-5"><p align="left"><img src="<%=request.getContextPath()%>/assets/img/pastillasDGA.jpg" width="600" border="0"></p></div>
                <div class="col-md-5"><p align="right"><img src="<%=request.getContextPath()%>/assets/img/logoperu1.png" width="165" border="0"></p></div>
                <div class="col-md-1"></div>
            </div>
            <br>
            <br>

            <div class="container">
                <div class="navbar navbar-inverse">
                    <div class="navbar-header">
                        <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                            <span class="icon-bar"></span>
                        </button>

                    </div>
                    <div class="navbar-collapse collapse">
                        <ul class="nav navbar-nav navbar-left">
                            <li class="active"><a href="#">Inicio</a></li>
                            <li><a href="#">Actualizar Información</a></li>
                            <li><a href="#">Salir</a></li>
                        </ul>
                    </div><!--/.nav-collapse -->
                </div>
            </div>

            <!--A PARTIR DE AQUÍ COLOCAR EL CONTENIDO-->
            <div class="container">
                <div class="row">
                    <div class="col-md-4 ">
                        <ul class="nav nav-list well">
                            <li class="active"><a href=""><span class="glyphicon glyphicon-home"></span> Inicio</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Gestión de Sesiones/talleres</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Gestión de NNAs</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Gestión de Juzgado</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Gestión de CAR</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Administración de UAs</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Ingreso de familias internacionales</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Registro de familias por etapa</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Buscador de Registros</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Administración de usuarios</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Gestión de Organismo Acreditado </a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Gestión de Autoridad Central</a></li>
                            <li><a href="#"><span class="glyphicon glyphicon-chevron-right"></span> Cambio Contraseña</a></li>    
                        
                        </ul>
                    </div>

                    <div class="col-md-6 col-md-offset-1">
                        <p align="right"><button id="singlebutton" name="singlebutton" style="background: black; color: white" class="btn btn-default">Volver</button></p>
                        <h1 align="center"><strong>Proceso de designación</strong></h1>
                        
                         <form class="form-horizontal">
                            <fieldset>
                                         <!-- Text input-->
                                         <br>
                                         <h3><strong> Datos principales del NNA</strong></h3>
                                         <br>
                                             <div class="table-responsive">
                                                <table class="table table-bordered table-striped">
                                                    <thead>
                                                        <tr>
                                                            <th class="col-sm-2 " rowspan="2">Nombre</th>
                                                            <th class="col-sm-2 " rowspan="2">Apellido Paterno</th>
                                                            <th class="col-sm-2 " rowspan="2">Apellido Materno</th>
                                                            <th class="col-sm-2 " rowspan="2">Sexo</th>
                                                            <th class="col-sm-2 " colspan="2">Edad</th>
                                                            <th class="col-sm-2 " rowspan="2">Clasificación</th> 
                                                            <th class="col-sm-2 " rowspan="2">Retirar</th> 
                                                        </tr>
                                                        <tr>
                                                            <th>Años</th>
                                                            <th>Meses</th>
                                                        </tr>
                                                    </thead>

                                                    <tbody>
                                                            <tr>
                                                                <td>Nombre 1</td>
                                                                <td>Apellidos 1</td>
                                                                <td>Apellidos 1</td>
                                                                <td>Femenino</td>
                                                                <td>10</td>
                                                                <td>6</td>
                                                                <td>Prioritario</td>
                                                                <td><button href="#" class="btn btn-default">
                                                                    <span class="glyphicon glyphicon-minus-sign"></span> 
                                                                    </button></td>
                                                            </tr>
                                                           <tr>
                                                                <td>Nombre 2</td>
                                                                <td>Apellidos 2</td>
                                                                <td>Apellidos 2</td>
                                                                <td>Masculino</td>
                                                                <td>10</td>
                                                                <td>6</td>
                                                                <td>Prioritario</td>
                                                                <td><button href="#" class="btn btn-default">
                                                                    <span class="glyphicon glyphicon-minus-sign"></span> 
                                                                    </button></td>
                                                            </tr>
                                                 </tbody>
                                             </table>
                                          </div>
                                       
                                         <button id="singlebutton" name="singlebutton" class="btn btn-default">Agregar NNA</button>
                                         <br>
                                         <br>
                                         <h3><strong> Datos del proceso de designación</strong></h3>
                                         <br>  
                                         <div class="control-group">
                                            <label class="control-label">Número de designación</label>
                                                <div class="controls">
                                                  <input id="full-name" name="full-name" type="text" class="input-xlarge">
                                                </div>
                                         </div>
                                         <br>
                                         <div class="control-group">
                                            <label class="control-label">Prioridad de la familia</label>
                                                <div class="controls">
                                                 <select disable >
                                                      <option value="sia">3</option>
                                                         <option value="mia">2</option>
                                                 </select>
                                         </div>  
                                         </div>
                                         <br>
                                         <div class="control-group">
                                            <label class="control-label">Fecha de consejo</label>
                                                <div class="controls">
                                                  <input id="full-name" name="full-name" type="text" class="datepicker input-xlarge">
                                                </div>
                                         </div>
                                         <br>
                                         <div class="control-group">
                                            <label class="control-label">Tipo de propuesta</label>
                                                <div class="controls">
                                                 <select disable >
                                                      <option value="sia">Directa</option>
                                                      <option value="mia">Dupla</option>
                                                      <option value="mia">Terna</option>
                                                      <option value="mia">Prioritaria</option>
                                                 </select>
                                         </div>  
                                         </div>
                                         <br>
                                         <div class="control-group">
                                            <label class="control-label">Observaciones</label>
                                                <div class="controls">
                                                  <textarea rows="4" cols="50"> </textarea>
                                                </div>
                                         </div>
                                         <br>
                                <!-- Button -->
                                <br>
                                <div class="control-group">
                                    <div class="controls">
                                        <button id="singlebutton" name="singlebutton" class="btn btn-default">Designar</button>
                                    </div>
                                </div>
                            </fieldset>
                        </form>
                        
                    </div>
                </div>
            </div>
            <!--FIN DE CONTENIDO-->
            <br>
            <br>

            <div id="footer">
                <div id="ja-footer" class="wrap">
                    <hr width=80% align="center">
                    <p align="center"><h5 class="caption" align="center" style="text-align: center;">MINISTERIO DE LA MUJER Y POBLACIONES VULNERABLES<br>Jr. Camaná 616, Lima - Perú<br>Central telefónica: (511) 626-1600</h5></p>
                    <p align="right">Diseñado por RED<br>www.red.net.pe</p>
                </div>
            </div>
             <!-- Bootstrap core JavaScript
        ================================================== -->
        <script type="text/javascript" src="${pageContext.servletContext.contextPath}/assets/js/jquery-1.10.2.min.js"></script> 
        <script  type="text/javascript" src="${pageContext.servletContext.contextPath}/assets/js/bootstrap.js"></script>
        <script type="text/javascript" src="${pageContext.servletContext.contextPath}/assets/js/bootstrap-datepicker.js"></script>
        <script type="text/javascript" src="${pageContext.servletContext.contextPath}/assets/js/locales/bootstrap-datepicker.es.js"></script>
        <script type="text/javascript">
           
             $('.datepicker').datepicker({"format": "dd/mm/yyyy", "weekStart": 1, "autoclose": true, "language":"es"});
            
        </script>
        <!-- Placed at the end of the document so the pages load faster -->
    </body>
</html>